<?php
/* @var $this SiteController */

$this->pageTitle = Yii::app()->name;
Yii::app()->getClientScript()->registerScriptFile(Yii::app()->baseUrl . '/assets/metro/plugins/layerslider/js/layerslider.kreaturamedia.jquery.js', CClientScript::POS_END);
Yii::app()->getClientScript()->registerScriptFile(Yii::app()->baseUrl . '/assets/metro/scripts/index.js', CClientScript::POS_END);
Yii::app()->getClientScript()->registerCssFile(Yii::app()->baseUrl . '/assets/metro/plugins/layerslider/css/layerslider.css');

?>
<?php if(!empty($bannerTop)) { ?>
    <!-- BEGIN SLIDER -->
    <?php
        echo CHtml::openTag("div", array("class"=> "page-slider margin-bottom-35"));
            echo CHtml::openTag("div", array("style" => "width: 100%; height: 494px; margin: 0 auto", "id" => "layerslider"));
                foreach($bannerTop as $banner){
                    echo CHtml::openTag("div", array("class"=>"ls-layer ls-layer1", "style" => "slidedirection: right; transition2d: 24,25,27,28;"));
                        echo CHtml::openTag("img", array("src"=> Yii::app()->request->baseUrl.$banner->content_dtl, "atl" => $banner->title, "class" => "ls-bg"));
                        echo CHtml::openTag("div", array("class"=>"ls-s-1 title", "style" => "top: 96px; left: 35%; slidedirection : fade; slideoutdirection : fade; durationin : 750; durationout : 750;
                                                                        easingin : easeOutQuint; rotatein : 90; rotateout : -90; scalein : .5; scaleout : .5; showuntil : 4000; white-space: nowrap;"));
                        echo $banner->title;
                        echo CHtml::closeTag("div");
                    echo CHtml::closeTag("div");
                }
            echo CHtml::closeTag("div");
        echo CHtml::closeTag("div");

    ?>
    <!-- END SLIDER -->
<?php } ?>

<div class="main">
<div class="container">
<!-- BEGIN SALE PRODUCT & NEW ARRIVALS -->
<div class="row margin-bottom-40">
    <!-- BEGIN SALE PRODUCT -->
    <div class="col-md-12 sale-product">
        <h2>New Arrivals</h2>

        <div class="bxslider-wrapper">
            <ul class="bxslider" data-slides-phone="1" data-slides-tablet="2" data-slides-desktop="5"
                data-slide-margin="15">
                <li>
                    <div class="product-item">
                        <div class="pi-img-wrapper">
                            <img src="assets/temp/products/model1.jpg" class="img-responsive" alt="Berry Lace Dress">

                            <div>
                                <a href="assets/temp/products/model1.jpg"
                                   class="btn btn-default fancybox-button">Zoom</a>
                                <a href="#product-pop-up" class="btn btn-default fancybox-fast-view">View</a>
                            </div>
                        </div>
                        <h3><a href="item.html">Berry Lace Dress</a></h3>

                        <div class="pi-price">$29.00</div>
                        <a href="#" class="btn btn-default add2cart">Add to cart</a>

                        <div class="sticker sticker-sale"></div>
                    </div>
                </li>
                <li>
                    <div class="product-item">
                        <div class="pi-img-wrapper">
                            <img src="assets/temp/products/model2.jpg" class="img-responsive" alt="Berry Lace Dress">

                            <div>
                                <a href="assets/temp/products/model2.jpg"
                                   class="btn btn-default fancybox-button">Zoom</a>
                                <a href="#product-pop-up" class="btn btn-default fancybox-fast-view">View</a>
                            </div>
                        </div>
                        <h3><a href="item.html">Berry Lace Dress2</a></h3>

                        <div class="pi-price">$29.00</div>
                        <a href="#" class="btn btn-default add2cart">Add to cart</a>
                    </div>
                </li>
                <li>
                    <div class="product-item">
                        <div class="pi-img-wrapper">
                            <img src="assets/temp/products/model6.jpg" class="img-responsive" alt="Berry Lace Dress">

                            <div>
                                <a href="assets/temp/products/model6.jpg"
                                   class="btn btn-default fancybox-button">Zoom</a>
                                <a href="#product-pop-up" class="btn btn-default fancybox-fast-view">View</a>
                            </div>
                        </div>
                        <h3><a href="item.html">Berry Lace Dress2</a></h3>

                        <div class="pi-price">$29.00</div>
                        <a href="#" class="btn btn-default add2cart">Add to cart</a>
                    </div>
                </li>
                <li>
                    <div class="product-item">
                        <div class="pi-img-wrapper">
                            <img src="assets/temp/products/model4.jpg" class="img-responsive" alt="Berry Lace Dress">

                            <div>
                                <a href="assets/temp/products/model4.jpg"
                                   class="btn btn-default fancybox-button">Zoom</a>
                                <a href="#product-pop-up" class="btn btn-default fancybox-fast-view">View</a>
                            </div>
                        </div>
                        <h3><a href="#">Berry Lace Dress4</a></h3>

                        <div class="pi-price">$29.00</div>
                        <a href="#" class="btn btn-default add2cart">Add to cart</a>

                        <div class="sticker sticker-new"></div>
                    </div>
                </li>
                <li>
                    <div class="product-item">
                        <div class="pi-img-wrapper">
                            <img src="assets/temp/products/model5.jpg" class="img-responsive" alt="Berry Lace Dress">

                            <div>
                                <a href="assets/temp/products/model5.jpg"
                                   class="btn btn-default fancybox-button">Zoom</a>
                                <a href="#product-pop-up" class="btn btn-default fancybox-fast-view">View</a>
                            </div>
                        </div>
                        <h3><a href="item.html">Berry Lace Dress5</a></h3>

                        <div class="pi-price">$29.00</div>
                        <a href="#" class="btn btn-default add2cart">Add to cart</a>
                    </div>
                </li>
                <li>
                    <div class="product-item">
                        <div class="pi-img-wrapper">
                            <img src="assets/temp/products/model3.jpg" class="img-responsive" alt="Berry Lace Dress">

                            <div>
                                <a href="assets/temp/products/model3.jpg"
                                   class="btn btn-default fancybox-button">Zoom</a>
                                <a href="#product-pop-up" class="btn btn-default fancybox-fast-view">View</a>
                            </div>
                        </div>
                        <h3><a href="item.html">Berry Lace Dress3</a></h3>

                        <div class="pi-price">$29.00</div>
                        <a href="#" class="btn btn-default add2cart">Add to cart</a>
                    </div>
                </li>
                <li>
                    <div class="product-item">
                        <div class="pi-img-wrapper">
                            <img src="assets/temp/products/model7.jpg" class="img-responsive" alt="Berry Lace Dress">

                            <div>
                                <a href="assets/temp/products/model7.jpg"
                                   class="btn btn-default fancybox-button">Zoom</a>
                                <a href="#product-pop-up" class="btn btn-default fancybox-fast-view">View</a>
                            </div>
                        </div>
                        <h3><a href="item.html">Berry Lace Dress3</a></h3>

                        <div class="pi-price">$29.00</div>
                        <a href="#" class="btn btn-default add2cart">Add to cart</a>
                    </div>
                </li>
            </ul>
        </div>
    </div>
    <!-- END SALE PRODUCT -->
</div>
<!-- END SALE PRODUCT & NEW ARRIVALS -->

<!-- BEGIN SALE PRODUCT & NEW ARRIVALS -->
<div class="row margin-bottom-40">
    <!-- BEGIN SALE PRODUCT -->
    <div class="col-md-12 sale-product">
        <h2>New Arrivals</h2>

        <div class="bxslider-wrapper">
            <ul class="bxslider" data-slides-phone="1" data-slides-tablet="2" data-slides-desktop="5"
                data-slide-margin="15">
                <li>
                    <div class="product-item">
                        <div class="pi-img-wrapper">
                            <img src="assets/temp/products/model1.jpg" class="img-responsive" alt="Berry Lace Dress">

                            <div>
                                <a href="assets/temp/products/model1.jpg"
                                   class="btn btn-default fancybox-button">Zoom</a>
                                <a href="#product-pop-up" class="btn btn-default fancybox-fast-view">View</a>
                            </div>
                        </div>
                        <h3><a href="item.html">Berry Lace Dress</a></h3>

                        <div class="pi-price">$29.00</div>
                        <a href="#" class="btn btn-default add2cart">Add to cart</a>

                        <div class="sticker sticker-sale"></div>
                    </div>
                </li>
                <li>
                    <div class="product-item">
                        <div class="pi-img-wrapper">
                            <img src="assets/temp/products/model2.jpg" class="img-responsive" alt="Berry Lace Dress">

                            <div>
                                <a href="assets/temp/products/model2.jpg"
                                   class="btn btn-default fancybox-button">Zoom</a>
                                <a href="#product-pop-up" class="btn btn-default fancybox-fast-view">View</a>
                            </div>
                        </div>
                        <h3><a href="item.html">Berry Lace Dress2</a></h3>

                        <div class="pi-price">$29.00</div>
                        <a href="#" class="btn btn-default add2cart">Add to cart</a>
                    </div>
                </li>
                <li>
                    <div class="product-item">
                        <div class="pi-img-wrapper">
                            <img src="assets/temp/products/model6.jpg" class="img-responsive" alt="Berry Lace Dress">

                            <div>
                                <a href="assets/temp/products/model6.jpg"
                                   class="btn btn-default fancybox-button">Zoom</a>
                                <a href="#product-pop-up" class="btn btn-default fancybox-fast-view">View</a>
                            </div>
                        </div>
                        <h3><a href="item.html">Berry Lace Dress2</a></h3>

                        <div class="pi-price">$29.00</div>
                        <a href="#" class="btn btn-default add2cart">Add to cart</a>
                    </div>
                </li>
                <li>
                    <div class="product-item">
                        <div class="pi-img-wrapper">
                            <img src="assets/temp/products/model4.jpg" class="img-responsive" alt="Berry Lace Dress">

                            <div>
                                <a href="assets/temp/products/model4.jpg"
                                   class="btn btn-default fancybox-button">Zoom</a>
                                <a href="#product-pop-up" class="btn btn-default fancybox-fast-view">View</a>
                            </div>
                        </div>
                        <h3><a href="#">Berry Lace Dress4</a></h3>

                        <div class="pi-price">$29.00</div>
                        <a href="#" class="btn btn-default add2cart">Add to cart</a>

                        <div class="sticker sticker-new"></div>
                    </div>
                </li>
                <li>
                    <div class="product-item">
                        <div class="pi-img-wrapper">
                            <img src="assets/temp/products/model5.jpg" class="img-responsive" alt="Berry Lace Dress">

                            <div>
                                <a href="assets/temp/products/model5.jpg"
                                   class="btn btn-default fancybox-button">Zoom</a>
                                <a href="#product-pop-up" class="btn btn-default fancybox-fast-view">View</a>
                            </div>
                        </div>
                        <h3><a href="item.html">Berry Lace Dress5</a></h3>

                        <div class="pi-price">$29.00</div>
                        <a href="#" class="btn btn-default add2cart">Add to cart</a>
                    </div>
                </li>
                <li>
                    <div class="product-item">
                        <div class="pi-img-wrapper">
                            <img src="assets/temp/products/model3.jpg" class="img-responsive" alt="Berry Lace Dress">

                            <div>
                                <a href="assets/temp/products/model3.jpg"
                                   class="btn btn-default fancybox-button">Zoom</a>
                                <a href="#product-pop-up" class="btn btn-default fancybox-fast-view">View</a>
                            </div>
                        </div>
                        <h3><a href="item.html">Berry Lace Dress3</a></h3>

                        <div class="pi-price">$29.00</div>
                        <a href="#" class="btn btn-default add2cart">Add to cart</a>
                    </div>
                </li>
                <li>
                    <div class="product-item">
                        <div class="pi-img-wrapper">
                            <img src="assets/temp/products/model7.jpg" class="img-responsive" alt="Berry Lace Dress">

                            <div>
                                <a href="assets/temp/products/model7.jpg"
                                   class="btn btn-default fancybox-button">Zoom</a>
                                <a href="#product-pop-up" class="btn btn-default fancybox-fast-view">View</a>
                            </div>
                        </div>
                        <h3><a href="item.html">Berry Lace Dress3</a></h3>

                        <div class="pi-price">$29.00</div>
                        <a href="#" class="btn btn-default add2cart">Add to cart</a>
                    </div>
                </li>
            </ul>
        </div>
    </div>
    <!-- END SALE PRODUCT -->
</div>
<!-- END SALE PRODUCT & NEW ARRIVALS -->
</div>
</div>